<template>
  <v-layout class="release-container" justify-start align-start wrap>
    <v-flex md12 text-xs-left>
      <v-btn flat round @click="$router.go(-1)">
        <v-icon>keyboard_arrow_left</v-icon>
        <div class="ml-2">返回</div>
      </v-btn>
    </v-flex>
    <v-flex md6 pt-4>
      <v-layout justify-start align-center wrap px-5>
        <v-flex md12 d-flex align-center justify-start>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">退款方式 *</span>
          </v-flex>

          <v-flex md8>
            <v-select solo :items="paymethods" v-model="account.payType"></v-select>
          </v-flex>
        </v-flex>

        <v-flex md12 d-flex align-center justify-space-between mt-4>
          <!-- 充值方式 -->
          <v-flex md4>
            <span class="subTitle title-color">姓名 *</span>
          </v-flex>

          <v-flex md8>
            <v-text-field type="text" solo v-model="account.trueName" hide-details></v-text-field>
          </v-flex>
        </v-flex>

        <v-flex md12 d-flex align-center justify-space-between mt-4>
          <!-- 充值方式 -->
          <v-flex md4>
            <span class="subTitle title-color">账户 *</span>
          </v-flex>

          <v-flex md8>
            <v-text-field type="text" solo v-model="account.account" hide-details></v-text-field>
          </v-flex>
        </v-flex>

        <v-flex md12 mt-4 d-flex align-center justify-center>
          <v-flex md4>
            <v-btn large round color="primary" @click="onSubmit">
              <span class="title">立即提交</span>
            </v-btn>
          </v-flex>
        </v-flex>
      </v-layout>
    </v-flex>
  </v-layout>
</template>


<script lang="ts">
// 使用类装饰器
import { Component, Vue } from "vue-property-decorator";
import {  User } from "@/api";
import Cookie from "js-cookie";
import { CashAccountSet } from '@/api/bean';
declare const $Vue: Vue;

@Component({})
export default class TopupAudit extends Vue {

  private paymethods: any = [{
    text: '支付宝',
    value: '1'
  }, {
    text: '微信',
    value: '0'
  }];


  private defaultShop: any = {
    payType: "",
    trueName: '',
    account: '',
  };

  private account: any = {};

  private requiredFields: Array<string> = [
    "payType",
    "trueName",
    "account",
  ];

  protected mounted() {
    this.account = Object.assign({}, this.defaultShop);
    let type = this.$route.params.type;
    if (type === "edit") {
      this.account = this.$route.params.item;
    }
  }

  private onSubmit() {
    if (!this.validate()) {
      return $Vue.$emit("snackbar", {
        message: "请填写必填字段"
      });
    }
    this.addAccount();
  }

  private validate(): boolean {
    let pass = true;
    this.requiredFields.forEach((item: string) => {
      if (this.account[item] === "") {
        pass = false;
      }
    });
    return pass;
  }

  private async addAccount() {
    const params: any = {
      userId: Cookie.get("seller_userId"),
      ...this.account,
    };
    const { data } = await User.saveAccount.r(params);
    console.log("saveAccount", data);

    $Vue.$emit("snackbar", {
      message: data.message
    });
    
    if (data.result === 0) {
      this.$router.go(-1);
    } else {

    }
  }
}
</script>

<style lang="less" scoped>
</style>


